<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    1.js的核心
    ECMASCRIPT:定义了js的语法规范,包含啦语言的基本的数据类型,包括对象
    Bom:浏览器对象模型,用于访问浏览器的功能,这些功能和任何的网页的内容无关
    Dom:文档对象模型,操作html标签的这些能力,操作网页的内容

    2.Bom的核心
    - `BOM` 的核心就是 `window` 对象
    - `window` 是浏览器内置的一个对象，里面包含着操作浏览器的方法
    -window对象是js最大的对象,里面包含很多子对象,子对象又包含了方法
    `window对象2个身份:1个身份是js中最大的对象  第2个身份就是浏览器窗口

    3.window对象能干点啥
    - 获取一些浏览器的相关信息（窗口的大小）
    - 操作浏览器进行页面跳转
    - 获取当前浏览器地址栏的信息
    - 操作浏览器的滚动条
    - 浏览器的信息（浏览器的版本）
    - 让浏览器出现一个弹出框（`alert` / `confirm` / `prompt`）

    <hr>
    <span id="span1">1234567</span>

    <script>
        // 一,获取浏览器的窗口尺寸
        // 可视区:浏览器里面用户能看到的区域
        // -  innerHeight` 和 `innerWidth`
        // - 这两个方法分别是用来获取浏览器窗口的宽度和高度（包含滚动条的）
        // console.log(window.innerHeight);
        // console.log(window.innerWidth);
    </script>

    2.clientHeight clientWidth
    这两个方法分别是用来获取文档的窗口的宽度和高度(不包含滚动条,滚动条属于浏览器的,不属于文档本身)
    document文档
    documentElement 默认的html标签表示
    document.body 默认的body标签
    document.html 默认的html标签表示
    document.title 默认表示的标签
    <script>
        //  ie低版本,8以下版本
        // console.log(document.documentElement.clientHeight);//450
        // console.log(document.documentElement.clientWidth);
        console.log(document.body.clientHeight);
        console.log(document.body.clientWidth);
    </script>

    <script>
        document.documentElement.onclick=function(){
            alert("1234")
        }
    </script>

</body>
</html>